<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
	#wrapper{
		margin-left: 70px;
		width: 800px;
		font-family: nanum;
	}
	.product_line { 
		width:705px; height:2px; float:left; background:#d3ccbe;
	}
</style>
</head>
<body>
	<div id="wrapper">
		<table>
			<tr>
				<td style="vertical-align: bottom; text-align: left">
					<img src="images/game/game_title.png" width="90%">
				</td>
				<td style="text-align: right;" width="550px">
					<form action="gameForm.do" method="POST">
						<input type="hidden" name="count" value="1">
						<input type="image" src="images/giftcard/giftcard_menu_img.png"
							   width="55%" style="margin-right: 50px">
					</form>
				</td>
			</tr>
		</table>
		<p class="product_line"></p>
		
		<!-- click 하기 전 -->
		<c:if test="${count==0}">
			<div style="width: 705px; text-align: center; padding-top: 100px;">
				<img src="images/game/cookie4.png" width="60%" style="cursor: pointer"
					 onclick="location.href='gameForm.do?count=1'">
			</div>
		</c:if>
		
		<!-- click 한 후 -->
		<c:if test="${count==1}">
			<!-- 꽝 -->
			<c:if test="${lotto == 0}">
				<div style="width: 705px; text-align: center; padding-top: 100px;">
					<img src="images/game/cookie3.png" width="60%">
				</div>
			</c:if>
			<c:if test="${lotto == 1}">
				<div style="width: 705px; text-align: center; padding-top: 100px;">
					<img src="images/game/cookie.png" width="60%">
					<br><br>
					<span style="color:#F6502B; font-weight: bold;">마이페이지에 가시면 적립 내역을 확인하실 수 있습니다.</span>
				</div>
			</c:if>
			<c:if test="${lotto == 2}">
				<div style="width: 705px; text-align: center; padding-top: 100px;">
					<img src="images/game/cookie2.png" width="60%">
					<br><br>
					<span style="color:#F6502B; font-weight: bold;">마이페이지에 가시면 적립 내역을 확인하실 수 있습니다.</span>
				</div>
			</c:if>
			<c:if test="${lotto == 3}">
				<script type="text/javascript">
					alert('로그인 상태가 아니므로, 게임에 참여하실 수 없습니다.\n로그인해주시기 바랍니다!');
					location.href='login.do';
				</script>
			</c:if>
			<c:if test="${lotto == 4}">
				<script type="text/javascript">
					alert('마일리지가 부족합니다!!');
					location.href='gameForm.do?count=0';
				</script>
			</c:if>
		</c:if>
		<br>
		<div style="margin-left: 150px; margin-bottom: 70px" >		
			<ul>
				<li>게임에 참여할 때마다 마일리지 500point가 차감됩니다.</li>
				<li>마일리지가 부족한 경우, 게임에 참여할 수 없습니다.</li>
				<li>500point/1000point/꽝 중 한 가지에 당첨됩니다.</li>
				<li>마일리지 적립시, 내역은 마이페이지에서 확인 가능합니다.</li>
				<li style="color:#870200; font-weight: bold;">당첨확률이 높은 편이니 게임에 많은 참여 부탁드립니다.</li>
			</ul>
		</div>
	</div>
</body>
</html>